

import { Link, useNavigate } from "react-router-dom";
import HeaderTitle from "../login/header";
import { useTranslation } from 'react-i18next'
import style from "./index.module.less"
import { EyeInvisibleOutline, EyeOutline } from "antd-mobile-icons"
import React, { Fragment, useState, useEffect } from 'react'
import {
	Form,
	Input,
	Checkbox,
	Button,
	Toast,

} from 'antd-mobile'
import { getsystemnotice, getactivitylist } from "@/apis/user.js"

import bg from '../../static/PageAnnouncement_bg_shh.png'
import gg from '../../static/notice_icon_shh.png'
import xx from '../../static/message_icon_shh.png'

const DongTai = (props) => {
	const navigate = useNavigate()
	const [active,serActive]=useState(1);
	const [visible, setVisible] = useState(false)
	const [formData, setFormData] = useState({ name: '', password: '', checked: false })
	const [form] = Form.useForm()
	const [systemnotice,setSystemnotice] = useState([])
	
	useEffect(() => {
		console.log("初始化----我的消息");
		setTimeout(()=>{
			if (window.scrollTo) {
				window.scrollTo(0, 0);
			} else if (document.body.scrollTop) {
				document.body.scrollTop = 0;
			} else {
				document.documentElement.scrollTop = 0;
			}
			document.getElementById('root').scrollIntoView(true);
			document.getElementById('body').scrollIntoView(true);
		},0)
		// setFlag(true);
		gonggao()
		return ()=>{console.log('初始化----我的消息')}
	}, []);

	const changeTab=(current)=>{
		console.log('current:', current);
		serActive(current) //更新 active 状态
		setSystemnotice([])
		if(current == 1){
			gonggao()
		}else{
			xiaoxi()
		}
	}
	
	const gonggao=(current)=>{
		getsystemnotice().then(res => {
			if (res.status.errorCode == 0) {
				setSystemnotice(res.data)
			
			}
		})
	}
	const xiaoxi=(current)=>{
		getactivitylist().then(res => {
			if (res.status.errorCode == 0) {
				setSystemnotice(res.data.data)
			
			}
		})
	}
	const { t } = useTranslation();

	return (
		<React.Fragment>
			<HeaderTitle title={t('dongtai.title3')} right_title={t('agent.title2')}/>
			<div className={style['login_box']}>
				<div style={{ textAlign: 'center',width:'100%',borderRadius:'20px'}}>
					<img src={bg} alt="" style={{ width: '100%' }}/>
				</div>
				
				<div className={style['operation2']}>
				{/* {[style['tabs'], style['active']].join(' ')} */}
				
					<div className={`${style['tabs']} ${active === 1 ? style['active'] : ''}`} onClick={()=>{
						changeTab(1)
					}}>
            <img src={gg} alt="" />
            {t('dongtai.title4')}
					</div>
					<div className={`${style['tabs']} ${active === 2 ? style['active'] : ''}`} onClick={()=>{
						changeTab(2)
					}}>
          <img src={xx} alt="" />
            {t('dongtai.title5')}
            </div>
				</div>


		   <div className={`${style.content} ${style.anotherClass}`}>
				{systemnotice.length > 0 && (
					systemnotice.map((item,index)=>{
					return (
						<div key={index} onClick={() => navigate('/dongtaidetail/'+item.id)}>
							<div className={[style['operation']].join(' ')}>
								<span>
									{item.title}
								</span>
								<span  style={{color:'#999'}}>{item.created_at || '暂无'}</span>
							</div>
							{/* //<div style={{width:'100%',height:'20px'}}></div> */}
						</div>
					);
					})
				)}
				
		   </div>
			
		</div>
			
      

		</React.Fragment>
  

	)
}


export default DongTai
